<template>
  <j-modal
    title="移交"
    :width="getWidth"
    :visible="visible"
    switchFullscreen
    @ok="handleOk"
    :okButtonProps="{ class:{'jee-hidden': disableSubmit} }"
    @cancel="handleCancel"
    cancelText="关闭">
    <a-form-model
      ref="ruleForm"
      :model="form"
      :rules="rules"
      :label-col="labelCol"
      :wrapper-col="wrapperCol"
    >
      <a-form-model-item ref="name" label="移交操作单位" prop="officeNameTo">
<!--        <a-tree-select-->
<!--          v-model="form.officeCodeTo"-->
<!--          style="width: 100%"-->
<!--          :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"-->
<!--          :tree-data="treeData"-->
<!--          placeholder="请选择移交操作单位"-->
<!--          tree-default-expand-all-->
<!--        >-->
<!--        </a-tree-select>-->
<!--        <a-input-search-->
<!--          v-model="form.officeNameTo"-->
<!--          placeholder="请先选择用户"-->
<!--          readOnly-->
<!--          unselectable="on"-->
<!--          @search="onSearchDepUser">-->
<!--          <a-button slot="enterButton">选择移交操作单位</a-button>-->
<!--        </a-input-search>-->
        <a-cascader
          v-model="form.rootListData"
          :options="rootListData"
          placeholder="请选择相关操作单位"
          change-on-select
          :fieldNames="fieldNames"
          @change="onChange" />
      </a-form-model-item>
      <a-form-model-item style="margin-bottom: 100px" label="移交说明" prop="turnRemark">
        <a-input v-model="form.turnRemark" type="textarea" placeholder="请输入移交说明"/>
      </a-form-model-item>
    </a-form-model>
    <suoerviseJmodal ref="suoerviseJmodal" @ok="modalFormOk"></suoerviseJmodal>
  </j-modal>
</template>

<script>
  import { downLoadMix } from '@/utils/export-util/util'
  import {exportWarningTemplate, fzTurnoverLogAdd} from '@/api/warning/WarningData.js'
  import allComps from './index'
  import suoerviseJmodal from './suoerviseJmodal'
  import * as warningApi from "@api/warning/WarningData";
  import Vue from "vue";
  import { USER_INFO } from '@/store/mutation-types'
  export default {
    name: "HandleModal",
    components:{
      suoerviseJmodal
    },
    data () {
      return {
        fieldNames:{
          label:'nodeName',
          value:'nodeKey',
          children:'children'
        },
        form:{
          // officeCodeTo:'110000',
          // turnRemark:'132132',
          // alertOfficeCode:'',
          // alertRowCode:'',
          // id:''
          rootListData:[],
          officeCodeTo:'',
          officeNameTo:'',
          turnRemark:'',
          alertOfficeCode:'',
          // officeCodeRaise:'',
          officeNameRaise:'',
          alertRowCode:'',
          warningBaseId:'',
          warningSourceFlag:'',
          warningLevel:'',
          turnOverDate:'',
          warningTime:''
        },
        rootListData:[],
        labelCol: { span: 6 },
        wrapperCol: { span: 16 },
        rules:{
          officeNameTo: [{ required: true, message: '请选择移交操作单位', trigger: 'change' }],
        },
        treeData : [
          {
            title: 'Node1',
            value: '0-0',
            key: '0-0',
            children: [
              {
                value: '0-0-1',
                key: '0-0-1',
                scopedSlots: {
                  // custom title
                  title: 'title',
                },
              },
              {
                title: 'Child Node2',
                value: '0-0-2',
                key: '0-0-2',
              },
            ],
          },
          {
            title: 'Node2',
            value: '0-1',
            key: '0-1',
          },
        ],
        title:'',
        visible: false,
        disableSubmit: false,
      }
    },
    computed: {

      getWidth() {
        let width = 800;
        if(this.type===1 || this.type===4) {
          width = 600
        } else if(this.type===2) {
          width = 1000
        }
        return width
      }
    },
    watch: {
      visible: {
        immediate: true,
        deep: true,
        handler(val) {
          if(val) this.result = {}
        }
      }
    },
    methods: {
      onChange(value,key) {
        console.log(value,key);
        console.log(this.form.officeNameTo)
        this.form.officeNameTo = key[length].nodeName
        this.form.officeCodeTo = key[length].nodeKey
      },
      //获取当前时间
      dateFun(){
        var date = new Date();
        var nowMonth = date.getMonth() + 1;
        var strDate = date.getDate();
        var hours = date.getHours(); //获取当前小时
        var minutes = date.getMinutes(); //获取当前分钟
        var seconds = date.getSeconds(); //获取当前秒
        var seperator = "-";
        if (nowMonth >= 1 && nowMonth <= 9) {
          nowMonth = "0" + nowMonth;
        }
        if (strDate >= 0 && strDate <= 9) {
          strDate = "0" + strDate;
        }
        if (hours >= 0 && hours <= 9) {
          hours = "0" + hours;
        }
        if (minutes >= 0 && minutes <= 9) {
          minutes = "0" + minutes;
        }
        if (seconds >= 0 && seconds <= 9) {
          seconds = "0" + seconds;
        }
        return date.getFullYear() + seperator + nowMonth + seperator + strDate + " " + hours + ":" + minutes + ":" + seconds;
      },
      show(val){
        this.visible = true
        let user = Vue.ls.get(USER_INFO)
        console.log(user)
        this.form.turnOverDate = this.dateFun()
        this.form.warningTime = val.warningTime
        this.form.officeNameRaise = user.orgCode
        this.form.officeCodeRaise = user.orgCodeTxt
        this.form.alertOfficeCode = val.victimPhone
        this.form.alertRowCode = val.warningNumber
        this.form.warningBaseId = val.warningEvtid+''
        this.form.warningSourceFlag = '0'
        this.form.warningLevel = val.warningLevel
        console.log(this.form)
        warningApi.getTreeList().then(ser => {
          this.rootListData = ser.result
          console.log(ser)
        })
      },
      onSearchDepUser(){
        this.$refs.suoerviseJmodal.showAdminFun()
      },
      modalFormOk(val) {
        console.log(val)
        this.form.officeCodeTo = val.officeCode
        this.form.officeNameTo = val.officeName
        // this.form.professionalsWorkerId = val.professionalsWorkerId
        // this.form.professionalsWorker = val.professionalsWorker
      },
      close () {
        this.$emit('close');
        this.visible = false;
        this.form = {
          rootListData:[],
          officeCodeTo:'',
          officeNameTo:'',
          turnRemark:'',
          alertOfficeCode:'',
          officeCodeRaise:'',
          officeNameRaise:'',
          alertRowCode:'',
          warningBaseId:'',
          warningSourceFlag:'',
          warningLevel:'',
          turnOverDate:'',
          warningTime:''
        }
      },
      handleOk () {
        delete this.form.rootListData
        warningApi.fzTurnoverLogAdd(this.form).then(ser => {
          /*
          测试单位编码：110000
           */
          console.log(ser)
          if(ser.success){
            this.$message.success(ser.message)
            this.visible = false
            this.form = {
              rootListData:[],
              officeCodeTo:'',
              officeNameTo:'',
              turnRemark:'',
              alertOfficeCode:'',
              officeCodeRaise:'',
              officeNameRaise:'',
              alertRowCode:'',
              warningBaseId:'',
              warningSourceFlag:'',
              warningLevel:'',
              turnOverDate:'',
              warningTime:''
            }
          } else {
            this.$message.error(ser.message)
          }
        })
      },
      submitCallback(){
        this.$emit('ok',this.type);
        this.visible = false;
      },
      finishCallback(data) {
        this.type = 7
        this.result = data
        if(data && Object.keys(data).length>0) {
          this.$nextTick(()=>{
            this.$refs.realForm.getDatas(data)
          })
        }
      },
      handleCancel () {
        this.close()
      },
      getComponents(key) {
        let item = this.components.find(obj=> {return obj.type == this.type})
        return item[key]
      },
    }
  }
</script>
<style scoped lang="less">
/deep/.ant-modal-footer {
  position: relative;
  .footer-model {
    position: absolute;
    left: 20px;
    &::before {
      content: '*';
      color: #f5222d;
      margin-right: 5px;
    }
  }
}
</style>